import React, { useEffect } from 'react'
import {
    Form,
    Input,
    Button,
} from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
import { postRegister } from '../../api/index'

function Register() {
    const navigate = useNavigate()
    const onFinish = (values: any) => {
        postRegister( values ).then((res: any) => {
            console.log(res)
            if (res.data.err_code === 0) {
                navigate('/')
            }
        })
    }
    return (
        <div>
            <Form
                name='form'
                onFinish={onFinish}
                footer={
                    <Button block type='submit' color='primary' size='large'>
                        提交
                    </Button>
                }
            >
                <Form.Item
                    name='username'
                    label='姓名'
                    rules={[{ required: true, message: '姓名不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入姓名' />
                </Form.Item>
                <Form.Item
                    name='password'
                    label='密码'
                    rules={[{ required: true, message: '密码不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入密码' />
                </Form.Item>
                <Form.Item
                    name='nickname'
                    label='昵称'
                    rules={[{ required: true, message: '昵称不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入昵称' />
                </Form.Item>
            </Form>
        </div>
    )
}

export default Register
